<template>
  <a-drawer width="35%" :label-col="4" :wrapper-col="14" :visible="open" @close="onClose">
    <a-divider orientation="left">
      <b>{{ formTitle }}</b>
    </a-divider>
    <a-form-model ref="form" :model="form" :rules="rules">
      <a-col v-if="title == '修改数据'" :lg="12">
        <a-form-item label="Id">{{ form.id }}</a-form-item>
      </a-col>
      <a-form-item label="书名" prop="bookName">
        <a-input v-model="form.bookName" placeholder="请输入书名" />
      </a-form-item>
      <a-form-item label="单价" prop="price">
        <a-input v-model="form.price" placeholder="请输入单价" />
      </a-form-item>
      <a-form-item label="作者" prop="author">
        <a-input v-model="form.author" placeholder="请输入作者" />
      </a-form-item>
      <a-form-item label="内容" prop="content">
        <a-input v-model="form.content" placeholder="请输入内容" />
      </a-form-item>

      <div class="bottom-control">
        <a-space>
          <a-button type="primary" @click="submitForm"> 保存 </a-button>
          <a-button type="dashed" @click="cancel"> 取消 </a-button>
        </a-space>
      </div>
    </a-form-model>
  </a-drawer>
</template>

<script>
import { getBizBook, addBizBook, updateBizBook } from '@/api/book/bizBook'

export default {
  name: 'CreateForm',
  props: {
  
  },
  components: {},
  data() {
    return {
      loading: false,
      formTitle: '',
      // 表单参数
      form: {
        bookName: undefined,
        author: undefined,
      },
      open: false,
      rules: {
        price: [{ required: true, message: '单价不能为空', trigger: 'blur' }],
      },
    }
  },
  filters: {},
  created() {},
  computed: {},
  watch: {},
  methods: {
    onClose() {
      this.open = false
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.form = {
        bookName: undefined,
        price: undefined,
        author: undefined,
        content: undefined,
      }
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset()
      this.open = true
      this.formTitle = '添加岗位'
    },
    /** 修改按钮操作 */
    handleUpdate(row, ids) {
      this.reset()
      const id = row.id || this.ids
      getBizBook(id).then((response) => {
        this.form = response.data
        this.open = true
        this.formTitle = '修改岗位'
      })
    },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (this.form.id !== undefined) {
            updateBizBook(this.form).then((response) => {
              this.$message.success('修改成功', 3)
              this.open = false
              this.$emit('ok')
            })
          } else {
            addBizBook(this.form).then((response) => {
              this.$message.success('新增成功', 3)
              this.open = false
              this.$emit('ok')
            })
          }
        } else {
          return false
        }
      })
    },
  },
}
</script>
